<template>
    <a-cascader
        :value="renderValue"
        v-bind="$attrs"
        @change="cascaderChange"
        allowClear
    />
</template>

<script>
export default {
    name: "xlCascader",
    data(){
        return{

        }
    },
    methods:{
        cascaderChange(e){
            console.log(e)
            if(e == undefined){
                e = ''
            }
            this.$emit('change',e)
        }
    },
    computed:{
      renderValue(){
          if(!this.value) {
              return null
          }
          if( typeof this.value == 'string'){
              return JSON.parse(this.value)
          }else{
              return this.value
          }
      }
    },
    props:{
        value:undefined
    },
    model:{
        prop:'value',
        event:'change'
    }
}
</script>

<style scoped>

</style>